<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="../js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<button type="button">批量删除</button>
		<table border="1">
			<thead>
				<tr><th><input type="checkbox" name="cb_select_all" /></th><th>Header</th></tr>
			</thead>
			<tbody>
				<tr><td><input aaa="0" type="checkbox" name="cb_select" /></td><td>Data1</td></tr>
				<tr><td><input aaa="1" type="checkbox" name="cb_select" /></td><td>Data2</td></tr>
				<tr><td><input aaa="2" type="checkbox" name="cb_select" /></td><td>Data3</td></tr>
				<tr><td><input value="3" type="checkbox" name="cb_select" /></td><td>Data4</td></tr>
			</tbody>
		</table>
		<script type="text/javascript">
			let books = [
				{id: 1, name: 'Java从入门到放弃', price: 80, tdate: '2020-07-01', count: 1, account: "hehe"},
				{id: 2, name: 'Vue从入门到放弃', price: 90, tdate: '2020-07-02', count: 1, account: "haha"},
				{id: 3, name: 'Mysql从入门到放弃', price: 100.01, tdate: '2020-07-03', count: 1, account: "hehe"},
				{id: 4, name: '啥都从入门到放弃', price: 70.00, tdate: '2020-07-04', count: 1, account: "haha"},
			];
			let tbody = document.getElementsByTagName("tbody")[0];
			let tr = document.createElement("tr");
			tr.aaa = 1;
			tbody.appendChild(tr);
			let td = document.createElement("td");
			let input = document.createElement("input");
			input.type = "checkbox";
			input.value = 4;
			input.name = "cb_select";
			td.appendChild(input);
			tr.appendChild(td);
			
			
			$(function() {
				//id选择器、class、标签
				//属性选择器
				//筛选器，也叫过滤器。类似于CSS伪元素
				
				$("button").click(function() {
					//获取选中的checkbox
					$("input[name='cb_select']:checked").each(function(index, item) {
						// console.log($(this).parent().parent().parent());
						
						//不需要
						// let tbody = $(this).parent().parent().parent();
						// console.log(tbody);
						//通过parent()实现元素删除
						let tr = $(this).parent().parent();
						// tr.remove();
						console.log(this.value);
					});
				});
			});
		</script>
	</body>
</html>
